<template slot-scope="scope">
  <div>
    <el-checkbox :indeterminate="isIndeterminateDiscountMode" v-model="checkAllDiscountMode" @change="handleDiscountModeCheckAllChange">优惠模式</el-checkbox>
    <div style="margin:0px 0px 0px 20px;width:20px;">
      <el-checkbox-group v-model="checkedDiscountModeList" @change="handleCheckedCitiesChangeDiscountMode">
        <el-checkbox v-for="discountMode in sitesDiscountMode" :label="discountMode.discountModeCode" :key="discountMode.discountModeCode"
          :value="discountMode.discountModeCode">
          {{discountMode.discountModeName}}</el-checkbox>
      </el-checkbox-group>
    </div>
  </div>
</template>

<script>
  import { getDiscountMode } from '@/api/common/auth/roleManage'
  export default {
    name: "favorableModels",
    data() {
      return {
        checkAllDiscountMode: false,
        checkedDiscountModeList: [],
        loading: false,
        isIndeterminateDiscountMode: false,
        sitesDiscountMode: []
      }
    },
    props: {},
    created() {
      this.loadData()
    },
    methods: {
      async loadData() {
        // this.loading = true;
        // const getDiscountModeRes = await getDiscountMode(this.roleId)
        // if(getDiscountModeRes.resultCode === 200&&getDiscountModeRes.data&&getDiscountModeRes.data.length>0) {
        //   this.sitesDiscountMode = _.cloneDeep(getDiscountModeRes.data)
        // }
        // this.loading = false
      },
      handleDiscountModeCheckAllChange(val) {
        const checkedDiscountModeList = [];
        if (val) {
          for (var i = 0; i < this.sitesDiscountMode.length; i++) {
            checkedDiscountModeList.push(this.sitesDiscountMode[i].discountModeCode);
          }
        }
        this.checkedDiscountModeList = checkedDiscountModeList;
        this.isIndeterminateDiscountMode = false;
      },
      handleCheckedCitiesChangeDiscountMode(value) {
        let checkedCount = value.length;
        this.checkAllDiscountMode = checkedCount === this.sitesDiscountMode.length;
        this.isIndeterminateDiscountMode = checkedCount > 0 && checkedCount < this.sitesDiscountMode.length;
      },
      getData() {
        return [...this.checkedDiscountModeList]
      }
    }

  }

</script>

<style scoped>
  .el-checkbox+.el-checkbox {
    margin-left: 0px;
  }
  .el-checkbox {
    margin-right: 25px;
  }
</style>
